<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
		<link rel="shortcut icon" href="favicon.ico">
	<link rel="stylesheet" href="css/iconfont.css">
	<link rel="stylesheet" href="css/global.css">
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="css/swiper.min.css">
	<link rel="stylesheet" href="css/styles.css">
	<script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="js/swiper.min.js" charset="UTF-8"></script>
	<script src="js/global.js" charset="UTF-8"></script>
	<script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<script src="js/vue.js"></script>
	<script src="js/axios.min.js"></script>
	<script src="js/layui/layui.js"></script>
	<script type="text/javascript">
		/* 注册layui */
		layui.use('layer', function () {
			var layer = layui.layer;
		});

		layui.use('laydate', function(){
			var laydate = layui.laydate;

			//执行一个laydate实例
			laydate.render({
				elem: '#test1' //指定元素
			});
		});

		$(function(){
			new Vue({
				el: "#app",
				data: {
					user:{
						id:"",
						name:"",
						password:"",
						score:"",
						money:"",
						birthday:"",
						head:"",
						gender:"",

					},
					pwd:"",
					pwd2:"",

				},
				methods:{
					updatePwd(){
						console.log(this.pwd)
						if (this.pwd !== this.pwd2){
							layer.alert('两次密码不一致!', {
								shade: 0,
								icon: 5,
								skin: 'layer-ext-demo' //见：扩展说明
							})

							return;
						}
						this.user.paypwd=this.pwd;
						axios.post("http://192.168.6.125:8080/user/update",this.user).then(response=> {
							if (response.data.code==200) {
								parent.frames["right"].window.location.href="umodifypay_step3.html";
							}else{
								alert("错误:"+response.data.msg);
							}
						})
					}
				},
				mounted: function () {

					let user = localStorage.getItem("userz"); //查询对应的商品组
					this.user = JSON.parse(user);

				}
			});
		})
	</script>
</head>
<body class="bgf5">
<div class="user-content__box clearfix bgf" id="app">
	<div class="title">账户信息-修改支付密码</div>
	<div class="step-flow-box">
		<div class="step-flow__bd">
			<div class="step-flow__li step-flow__li_done">
				<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
				<p class="step-flow__title-top">输入旧密码</p>
			</div>
			<div class="step-flow__line step-flow__li_done">
				<div class="step-flow__process"></div>
			</div>
			<div class="step-flow__li step-flow__li_done">
				<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
				<p  class="step-flow__title-top">重置支付密码</p>
			</div>
			<div class="step-flow__line step-flow__line_ing">
				<div class="step-flow__process"></div>
			</div>
			<div class="step-flow__li">
				<div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
				<p class="step-flow__title-top">完成</p>
			</div>
		</div>
	</div>
	<form action="udai_modifypwd_step3.html" class="user-setting__form" role="form">
		<div class="form-group">
			<input class="form-control" v-model="pwd" name="phone" required="" maxlength="11" autocomplete="off" type="password">
			<span class="tip-text">新的密码</span>
			<span class="error_tip"></span>
		</div>
		<div class="form-group">
			<div class="form-group">
				<input class="form-control" v-model="pwd2" name="phone" required="" maxlength="11" autocomplete="off" type="password">
				<span class="tip-text">再次确认新的密码</span>
				<span class="error_tip"></span>
			</div>
		</div>
		<div class="user-form-group tags-box">
			<button type="button" @click="updatePwd" class="btn ">提交</button>
		</div>

	</form>
</div>
<script src="js/login.js"></script>
<script>
	$(document).ready(function(){
		$('.form-control').on('blur focus',function() {
			$(this).addClass('focus')
			if ($(this).val() == ''){$(this).removeClass('focus')}
		});
	});
</script>
</body>
</html>